﻿@model Ajax.Models.CommentViewModel

@{
    AjaxOptions ajaxOpts = new AjaxOptions
    {
        UpdateTargetId = "commentspart",
        Url = Url.Action("AddComment"),
        LoadingElementId = "loading",
        LoadingElementDuration = 2000,
        OnBegin = "OnBegin",
        OnFailure = "OnFailure",
        OnSuccess = "OnSuccess",
        OnComplete = "OnComplete"
    };
}
<script type="text/javascript">
    function OnBegin() {
        alert("This is the OnBegin Callback");
    }
    function OnSuccess(data) {
        alert("This is the OnSuccessCallback: " + data);
    }
    function OnFailure(request, error) {
        alert("This is the OnFailure Callback:" + error);
    }
    function OnComplete(request, status) {
        alert("This is the OnComplete Callback: " + status);
    }
</script>

<div id="loading" style="display:none; color:Red; font-weight: bold">
<p>Loading Data...</p>
</div>

@using (Ajax.BeginForm(ajaxOpts))
{
    <span>@Html.HiddenFor(x => x.NewComment.NewId)</span>
    <span>@Html.ValidationMessageFor(x => x.NewComment.Content)</span>
    <div>@Html.TextAreaFor(x => x.NewComment.Content)</div>
    <div><input type="submit" value="submit" /></div>
}

<ul>
    @foreach (var item in Model.Comments)
    {
        <li>@item.Content</li>
    }
</ul>
